<template>
    <div class="page LR">
        <!-- <van-form @submit="onSubmit" label-align="top" submit-on-enter class="form">
            <van-cell-group inset>
                <van-field v-model="username" name="用户名" label="用户名" placeholder="用户名"
                    :rules="[{ required: true, message: '请填写用户名' }]" />
                <van-field v-model="password" type="password" name="密码" label="密码" placeholder="密码"
                    :rules="[{ required: true, message: '请填写密码' }]" />
            </van-cell-group>
           
            <van-radio-group v-model="checked" direction="horizontal" class="check">
                <van-radio name="1">已有账号?</van-radio>
                <van-radio name="2">未注册?</van-radio>
            </van-radio-group>
            <div style="margin: 16px;" >
                <van-button round block type="primary" native-type="submit" v-if="checked==1">
                    登录
                </van-button>
                <van-button round block type="primary" native-type="submit" v-else="checked==2">
                   注册
                </van-button>
            </div>
        </van-form> -->
        <form action="" @submit.prevent>
            <p v-if="checked == 1"><span>账号密码登录</span></p>
            <p v-else><span>账号密码注册</span></p>
            <div class="login_username">
                <i class="iconfont icon-icon-test6"></i>
                <input type="text" class="login_username2" v-model="username" @blur="isHaveUser">

            </div>
            <div class="login_password">
                <i class="iconfont icon-jiami"></i>
                <input type="password" class="login_password2" v-model="password">

            </div>
            <van-radio-group v-model="checked" direction="horizontal" class="check">
                <van-radio name="1">已有账号?</van-radio>
                <van-radio name="2">未注册?</van-radio>
            </van-radio-group>
            <button type="submit" class="btn Lbtn" v-if="checked == 1" @click="login">
                登录
            </button>
            <button type="submit" class="btn Rbtn" v-else @click="register" :disabled="isRegister">
                注册
            </button>
        </form>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import {useRoute,useRouter} from 'vue-router'
import { loginApi, registerApi ,isHaveUserApi} from '@/api'


const username = ref('');
const password = ref('');
const checked = ref('1');
const isRegister=ref(true)
const router=useRouter()

// 登录
const login = async() => {
    console.log(username.value,password.value,'000');
     let { code, msg, token } = await loginApi({
         username: username.value,
         password: password.value
     })
     if (code == 200) {
         localStorage.setItem('token', token)
         router.push('/user')
     } else{
        alert(msg)
     }
}
// 验证是否已有该用户名
const isHaveUser=async()=>{
   console.log(username.value,'00');
     let data=await isHaveUserApi(username.value)
     console.log(data,'1111');
}
//注册
const register = async() => {
    // let data=await registerApi({
    //     username: username.value,
    //     password: password.value
    // })
    console.log('register', username.value, password.value);
}
</script>

<style lang="scss" scoped>
.LR {
    background: #ecc3c3;
}

.check {
    display: flex;
    justify-content: center;
}
</style>